import { View, Text, Image } from '@tarojs/components'
import classname from 'classname'

import './index.scss'

const DEFAULT_DATA = [
    {
        text: '首页'
    },
    {
        text: '综合'
    },
    {
        text: '质量'
    },
    {
        text: '安全'
    },
    {
        text: '我的'
    }
]
function Index({ data = DEFAULT_DATA, defaultIndex = 0 }) {
    return (
        <View className='ss-tabBar'>
            {
                data && data.length > 0 && data.map((item, index) => {
                    return (
                        <View className='ss-tabBar-item'>
                            {!!item.iconNormal &&
                            <Image className='ss-tabBar-icon' src={index === defaultIndex ? item.iconActive : item.iconNormal} />}
                            <Text className={classname('ss-tabBar-text', index === defaultIndex ? 'ss-tabBar-text__active' : '')}>{item.text}</Text>
                        </View>
                    )
                })
            }
        </View>
    )
}

export default Index